<template>
  <div class="box">
    <div class="top m-t">
      <div class="left"><div class="yuan"></div></div>
      <div class="zhong" @click="procedure()">登入我的商会</div>
      <div class="right">
        <!-- <van-icon name="arrow" color="#000" size=".26rem" /> -->
      </div>
    </div>
    <div
      class="top m-t"
      v-for="(item, index) in mine"
      :key="index"
      @click="my(item, index + 2)"
    >
      <div class="left">
        <div class="yuan"></div>
      </div>
      <div class="zhong">
        {{ item.name }}
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    mine: {
      type: Array,
      default: () => [],
    },
  },
  data() {
    return {};
  },

  methods: {
    //跳转商会小程序
    procedure() {
      this.$router.push({
        path: "/chambermin",
      });
    },
    //跳转页面
    my(i, num) {
      if (i.minePass == "true") {
        this.$router.push({
          path: "/brief",
          query: {
            title: i.name,
            id: i.id,
            pass: 1,
            num,
          },
        });
      }
      // 世界华商会长协会闽商酒友会
      else if (
        // i.id == "b9d04136-a521-4270-a91c-4d68c3badd24" ||
        // i.id == "551864aa-822b-4eea-9f87-b10883ca9fff" ||
        // i.id == "facc7960-91ba-45d2-bfea-1b1a8d822cdc"
        i.minePass == "false"
      ) {
        if (!sessionStorage.getItem("token")) {
          this.$router.push({
            path: "/login",
            query: {
              title: i.name,
              id: i.id,
              pass: 1,
              num,
            },
          });
        } else {
          this.$router.push({
            path: "/brief",
            query: {
              title: i.name,
              id: i.id,
              num,
            },
          });
        }
      } else {
        this.$router.push({
          path: "/brief",
          query: {
            title: i.name,
            id: i.id,
            num,
          },
        });
      }
    },
  },
};
</script>

<style scoped>
.box {
  width: 100%;
  min-height: 1rem;

  border-bottom: 2px solid #dad9df;
}
/* 头部区域 */
.top {
  width: 100%;
  display: flex;
}
/* 左边区域 */
.left {
  width: 8%;
  height: 100%;
  display: flex;
  justify-content: center;
  margin-top: 0.08rem;
}

.yuan {
  width: 0.15rem;
  height: 0.15rem;
  border-radius: 50%;
  background-color: black;
}
/* 中间区域 */
.zhong {
  padding-left: 0.04rem;
}
/* 右边区域 */
.right {
  width: 10%;

  display: flex;
  justify-content: center;
  align-items: center;
}
.m-t {
  margin: 0.08rem 0;
}
.right img {
  width: 0.16rem;
  height: 0.16rem;
}
</style>